    // --------------------------------------------------------------------------渲染页面数据
$(function(){
    var form = layui.form

    function loadLinksInfo(){
        $.ajax({
            type:'get',
            url:'/admin/links',
            success:function(res){
                // layui中将数据库数据通过layui table渲染到前端表格:layui table的自定义模板功能
                // 使用模板引擎渲染页面的数据
                var tags = template('table-tpl',res)
                $('.layui-table tbody').html(tags)
            }
        })
    }

    loadLinksInfo()

    // --------------------------------------------------------------------------删除友情链接
    $('.layui-table tbody').on('click','.delete',function(e){
        var id = $(e.target).data('id')
        layer.confirm('确定要删除吗？',function(index){
            $.ajax({
                type:'DELETE',
                url:'/admin/links/' + id,
                success:function(res){
                    if(res.status === 0){
                        // 删除成功
                        layer.close(index)
                        loadLinksInfo()
                    }
                }
            })
        })
    })
    // --------------------------------------------------------------------------编辑友情链接
    $('.layui-table tbody').on('click','.edit',function(e){
        var id = $(e.target).data('id')
        // 获取链接数据
        $.ajax({
            type:'get',
            url:'/admin/links/' + id,
            success:function(res){
                var index = layer.open({
                    type:1,
                    title:'编辑友情链接',
                    content:$('#edit-form-tpl').html(),
                    area: ['500px', '400px']
                })


                // 设置图片预览效果
                $('#preIcon').attr('src','http://localhost:8888/uploads/' + res.data.linkicon)
                // 删除 linkicon 字段
                delete res.data.linkicon
                // 回填其他数据
                form.val('editForm',res.data)



                // 绑定文件上传按钮点击事件
                $('#urlIcon').click(function(){
                    $('#linkFile').click()
                })

                // 监听文件选中事件
                let file = null
                // URL.createObjectURL() 静态方法会创建一个 DOMString;
                    // 一个表示参数中给出的对象的URL
                        // 通过FileReader.readAsDataURL(file)可以获取一段data:base64的字符串
                        // 过URL.createObjectURL(blob)可以获取当前文件的一个内存URL

                $('#linkFile').change(function(e){
                    const objectURL = URL.createObjectURL(e.target.files[0])
                    file = e.target.files[0]
                    $('#preIcon').attr('src',objectURL)
                })

                // 绑定表单提交事件
                $('#edit-form').submit(function(e){
                    e.preventDefault()
                    var fd = new FormData(this)
                    if(file){
                        // FormData接口的append方法会谈价一个新的值到FormData对象内的一个已存在的键中，入过键不存在，会添加该键

                        // 使用append的方法为 formdata 对象赋值
                        fd.append('linkicon',file)
                    }
                    $.ajax({
                        type:'put',
                        url:'/admin/links/' + id,
                        data:fd,
                        processData:false,
                        contentType:false,
                        success:function(res){
                            if(res.status === 0){
                                // 成功
                                layer.close(index)
                                loadLinksInfo()
                            }
                        }
                    })
                })
            }
        })
    })

    // --------------------------------------------------------------------------添加友情链接
    $('#add-link').click(function(){
        // layui弹出层
        var index = layer.open({
            type:1,
            title: '添加友情链接',
            content: $('#add-form-tpl').html(),
            area:['500px','400px']
        });
        // 绑定文件上传按钮点击事件
        $('#urlIcon').click(function(e){
            $('#linkFile').click()
        })
        // 监听文件选中事件
        // let file = null
        $('#linkFile').change(function(e){
            const objectURL = URL.createObjectURL(e.target.files[0])    //获取当前文件的一个内存url
            // file = e.target.files[0]
            $('#preIcon').attr('src',objectURL)
        })

        // 绑定添加链接的提交事件
        $('#add-form').submit(function (e) {
            e.preventDefault()

            var fd = new FormData(this)
            $.ajax({
              type: 'post',
              url: '/admin/links',
              data: fd,
              processData: false,
              contentType: false,
              success: function (res) {
                if (res.status === 0) {
                  // 关闭窗口
                  layer.close(index)
                  // 刷新列表
                  loadLinksInfo()
                }
              }
            })
          })
    })
})